// 定义路由规则组件
import { Route, Redirect, Switch } from "react-router-dom";

import React, { Component, lazy, Suspense } from "react";
// 引入组件
// lazy方法,用于以路由懒加载的方式引入组件
// Suspense 组件,用于应对对应的组件,并且提供loading加载,使用时,用它包裹对应要应用的组件即可
// Switch 组件包裹对应的路由规则,每次只能匹配一个路由规则,一般结合Redirect组件和404组件使用
import Loading from "@/components/Loading";
const Login = lazy(() => import("@/views/login/Login"));
const Dashboard = lazy(() => import("@/views/dashboard/Dashboard"));
// 引入其他页面组件....

class Index extends Component {
  render() {
    return (
      <Suspense fallback={<Loading></Loading>}>
        <Switch>
          <Route path="/login" component={Login}></Route>
          <Route path="/dashboard" component={Dashboard}></Route>
          <Redirect from="/" to="/login" exact></Redirect>
        </Switch>
      </Suspense>
    );
  }
}

export default Index;
